Channel: Clever Programmer
Category: Education
Tags: codingcleverprogrammersoftware developmentreact jsprogrammerdeveloperweb developmenttutorialsoftware developerprogrammingjavascript
Description: This video is a re-upload of the previous Facebook clone we uploaded last week. We realized it had some choppy editing and our intention with this video is to fix that. Once again, weβre sorry for re-uploading. Hope you guys can learn from this video. β€οΈ - Qazi In this tutorial, you're gonna be building the Facebook Blockchain Web 3.0 App using Solana (Anchor - Rust), Next JS, Netlify, Phantom, Sanity.io, and Tailwind CSS π₯ π Register at buildspace to claim your FREE NFT for building this project π app.buildspace.so/claim?id=cp3_facebook π Create your account on Netlify π ntl.fyi/clever π° Check out Phantom Wallet π phantom.app π₯ Get the free boosted plan with Sanity π sanity.io/cleverprogrammer ποΈ Link to the assets: drive.google.com/drive/folders/1E6ryR-sNBF64My0UvkO3mNEDDXeZ5oy4?usp=sharing π GitHub Repo: github.com/CleverProgrammers/facebook-solana-blockchain π€ Solana Faucet, to cover your transaction feed: solfaucet.com You'll be learning about: π Building a Web 3.0 Application on the Solana Blockchain π Styling your app using Tailwind CSS π Storing data on the blockchain π Writing smart contract in Rust (Anchor framework) π Adding Web 3.0 authentication using Phantom Buckle up, buttercup π β²οΈ Timestamps 00:00:00 Intro 00:03:29 Demo of the Solana Facebook Clone 00:05:14Set up your Next.js App with Tailwind CSS 00:07:18 Set up Phantom Wallet 00:11:35 How to Create and Set up your Netlify Account 00:13:44 How to Set up Sanity CMS 00:19:32 How to Install Rust, Anchor and Solana (Solana Development Environment) 00:26:42 How to Set up Solana Wallet in Terminal 00:30:31 How to Store Data on Solana Blockchain (Program for Posts) 00:57:51 Facebook Style Create Post Component 01:20:32 How to Store Data on Solana Blockchain (Integrate Frontend with Program) 01:51:18 How to Display Phantom Wallet Balance 01:56:52 Build Facebook Header Component 02:07:47 Fetch and Render Posts from the Solana Blockchain 02:21:39 How to Store Nested Data on Solana Blockchain (Program for Comments) 02:34:07 How to Store Nested Data on Solana Blockchain (Integrate Frontend with Program) 02:46:37 Fetch and Render On-Chain Data from Solana Blockchain (Comments) 03:03:04 Build Facebook Style Sidebar 03:10:08 Create Facebook Ads (Right Sidebar) 03:16:56 Create and Store Users in Sanity DB 03:35:28 Deploy to Netlify & Outro ======================================================= π¨βπ©βπ§βπ¦ Join our Discord Community: cleverprogrammer.com/discord π Join Profit with React: cleverprogrammer.com/pwr?utm_source=youtube&utm_medium=yt-description&utm_campaign=yt-build&utm_content=8-apr-facebook-web3-clone π¦ Follow me on Twitter: twitter.com/cleverqazi πΈ Follow me on Instagram: instagram.com/cleverqazi #web3 #frontend #blockchaindeveloper